import React, { useState } from 'react'
import { NavigationStackScreenComponent } from 'react-navigation-stack'
import { View, Image, Text, TextInput } from 'react-native'
import { RadiusButton, Toast } from 'components'
import { commonStyle, themeColors } from 'styles'
import assets from '../assets'
import { cancelStyle } from './styles'
import pos from 'api/pos';

const CancelNumberScreen: NavigationStackScreenComponent = props => {
	const [posCode, setPosCode] = useState('')
	return (
		<View style={{ ...commonStyle.containerColumn, ...cancelStyle.container }}>
			<Image style={cancelStyle.logo} source={assets.images.icon_cancel_lock} />
			<TextInput
				onChangeText={text => { setPosCode(text) }}
				placeholder="请输入参考号"
				placeholderTextColor={themeColors.placeholder}
				style={cancelStyle.input}
			/>
			<RadiusButton
				onPress={() => {
					if (posCode === "") {
						Toast.show('请输入参考号')
						return
					}
					pos.posApp.getPosGetInByRefNo({ refNo: posCode }).then(res => {
						if (res && res.posGetIn) {
							props.navigation.replace('CancelOrderDetail', { posGetin: res })
						} else {
							Toast.show('未找到对应单据！')
						}

					}).catch(err => {
						Toast.show(err.msg ? err.msg : '未找到对应单据，请稍后再试')
					})

				}}>
				<Text style={cancelStyle.login}>确认</Text>
			</RadiusButton>
		</View>
	)
}

CancelNumberScreen.navigationOptions = props => {
	return {
		title: '撤销',
	}
}

export default CancelNumberScreen
